<template>
	<view>
		<!-- 页首 -->
		<zw-header></zw-header>

		<!-- 左侧导航栏 -->
		<menu-wrapper active-index="2-1" style="background-color: #fff;padding: 0;">
			<view class="top-card flex-column" style="justify-content: center;">
				<view class="title">
					从AI创意到产品落地，一站式服务平台
				</view>
				<view class="title" style="font-size: 19px;font-weight: 300;margin-top: 40rpx;">
					From AI Creativity to Product Implementation: One-Stop Service Platform
				</view>
				<view class="title" style="text-align: left;font-size: 19px;font-weight: 300;margin-top: 80rpx;">
					设辑是一家位于福建晋江的鞋样研发和制作公司，成立于2016年。作为一家致力于创新和高品质制作的公司，我们秉承着“公司使命或愿景”的理念，为客户提供卓越的鞋样设计和制作服务。
				</view>
				<view class="title align-center" style="font-size: 20px;font-weight: 350;margin-top: 80rpx;">
					<view class="align-center bg" style="padding: 45rpx;">
						<image src="/static/image/home/zy.png" style="width: 140rpx;" mode="widthFix"></image>
						<view style="margin-left: 80rpx;">添加服务专员</view>
					</view>
					<view class="align-center bg" style="padding: 20px;margin-left: 120rpx;">
						<image src="/static/image/home/dw.png" style="width: 70rpx;" mode="widthFix"></image>
						<view style="margin-left: 80rpx;">公司地址导航</view>
					</view>
				</view>
			</view>
			<view class="align-center" style="background: #F9F9F9;">
				<view class="ld-title " :class="tabIndex==1?'ld-title-active':''" @click="clickOption(1)">产品研发制作</view>
				<view class="ld-title" :class="tabIndex==2?'ld-title-active':''" @click="clickOption(2)">模具开发</view>
				<view class="ld-title" :class="tabIndex==3?'ld-title-active':''" @click="clickOption(3)">订单生产</view>
			</view>
			<view style="margin-top: 80rpx;background: #F9F9F9;" v-if="tabIndex==1">
				设辑是一家位于[福建晋江]的鞋样研发和制作公司，成立于[成立时间]。作为一家致力于创新和高品质制作的公司，我们秉承着“[公司使命或愿景]”的理念，为客户提供卓越的鞋样设计和制作服务。

				制作实力：
				设计和研发团队： 我们的设计和研发团队拥有超过[年数]年的行业经验，熟练掌握各种设计软件和最新趋势，能够创造出独特、时尚的鞋样。
				生产设施： 我们的现代化生产设施配备先进的机器和技术，能够满足多种制作需求，包括不同种类的鞋样、材质和尺寸。
				材料采购： 我们与可信赖的供应商建立了长期合作伙伴关系，以确保我们所使用的原材料是高质量、环保的。
				合作案例：
				我们自豪地与众多客户合作，提供了多样化的鞋样制作服务。以下是一些我们过去的成功案例：
				客户A：为一家知名运动鞋品牌定制了一系列高性能跑鞋，赢得了市场上的高度认可。
				客户B：合作伙伴一家时尚鞋履公司，制作了一款畅销的女士高跟鞋系列，迅速占领了市场份额。
				客户C：与一家新兴品牌合作，定制了一款环保友好的休闲鞋，为客户树立了可持续性的形象。
				品质把控：
				质量保证： 我们采用严格的质量控制流程，确保每一双鞋样都经过仔细检查和测试，以满足客户的高要求。

				定制能力： 我们具有灵活的定制能力，能够根据客户的具体要求制作鞋样，包括设计、材料选择和生产工艺。

				可持续性： 我们关注可持续性，努力减少生产过程对环境的影响，采取了各种可持续性举措，包括可再生材料的使用和废弃物减少。

				交付准时性： 我们承诺按时交付客户的订单，确保项目按照预定时间表完成。

				附加信息：

				如果您有任何关于我们的需求或要求，或者希望了解更多关于我们的公司和合作流程的信息，请随时联系我们。我们期待着与您合作，共同打造出令人满意的鞋样。

				联系方式：

				公司地址：[公司地址]
				电话：[联系电话]
				电子邮件：[联系邮箱]
				网站：[公司网站]
				不要忘记在实际情况中自定义和个性化这份介绍，以突出你的公司的独特优势和价值。同时，确保提供可靠的联系信息以便潜在客户能够轻松与你取得联系。
			</view>
			<view style="margin-top: 80rpx;background: #F9F9F9;" v-if="tabIndex==2">
				公司名称： 设辑公司概况：
				设辑是一家位于[福建晋江]的鞋样研发和制作公司，成立于[成立时间]。作为一家致力于创新和高品质制作的公司，我们秉承着“[公司使命或愿景]”的理念，为客户提供卓越的鞋样设计和制作服务。
				制作实力：
				设计和研发团队： 我们的设计和研发团队拥有超过[年数]年的行业经验，熟练掌握各种设计软件和最新趋势，能够创造出独特、时尚的鞋样。
				生产设施： 我们的现代化生产设施配备先进的机器和技术，能够满足多种制作需求，包括不同种类的鞋样、材质和尺寸。
				材料采购： 我们与可信赖的供应商建立了长期合作伙伴关系，以确保我们所使用的原材料是高质量、环保的。
				合作案例：
				我们自豪地与众多客户合作，提供了多样化的鞋样制作服务。以下是一些我们过去的成功案例：
				客户A：为一家知名运动鞋品牌定制了一系列高性能跑鞋，赢得了市场上的高度认可。
				客户B：合作伙伴一家时尚鞋履公司，制作了一款畅销的女士高跟鞋系列，迅速占领了市场份额。
				客户C：与一家新兴品牌合作，定制了一款环保友好的休闲鞋，为客户树立了可持续性的形象。
				品质把控：质量保证： 我们采用严格的质量控制流程，确保每一双鞋样都经过仔细检查和测试，以满足客户的高要求。定制能力：
				我们具有灵活的定制能力，能够根据客户的具体要求制作鞋样，包括设计、材料选择和生产工艺。可持续性： 我们关注可持续性，努力减少生产过程对环境的影响，采取了各种可持续性举措，包括可再生材料的使用和废弃物减少。
				交付准时性： 我们承诺按时交付客户的订单，确保项目按照预定时间表完成。
				附加信息：
				如果您有任何关于我们的需求或要求，或者希望了解更多关于我们的公司和合作流程的信息，请随时联系我们。我们期待着与您合作，共同打造出令人满意的鞋样。
				联系方式：
				公司地址：[公司地址]
				电话：[联系电话]
				电子邮件：[联系邮箱]
				网站：[公司网站]
				不要忘记在实际情况中自定义和个性化这份介绍，以突出你的公司的独特优势和价值。同时，确保提供可靠的联系信息以便潜在客户能够轻松与你取得联系。
			</view>
			<view style="margin-top: 80rpx;background: #F9F9F9;" v-if="tabIndex==3">
				公司名称： 设辑公司概况：
				设辑是一家位于[福建晋江]的鞋样研发和制作公司，成立于[成立时间]。作为一家致力于创新和高品质制作的公司，我们秉承着“[公司使命或愿景]”的理念，为客户提供卓越的鞋样设计和制作服务。
				制作实力：
				设计和研发团队： 我们的设计和研发团队拥有超过[年数]年的行业经验，熟练掌握各种设计软件和最新趋势，能够创造出独特、时尚的鞋样。
				生产设施： 我们的现代化生产设施配备先进的机器和技术，能够满足多种制作需求，包括不同种类的鞋样、材质和尺寸。
				材料采购： 我们与可信赖的供应商建立了长期合作伙伴关系，以确保我们所使用的原材料是高质量、环保的。
				合作案例：
				我们自豪地与众多客户合作，提供了多样化的鞋样制作服务。以下是一些我们过去的成功案例：
				客户A：为一家知名运动鞋品牌定制了一系列高性能跑鞋，赢得了市场上的高度认可。
				客户B：合作伙伴一家时尚鞋履公司，制作了一款畅销的女士高跟鞋系列，迅速占领了市场份额。
				客户C：与一家新兴品牌合作，定制了一款环保友好的休闲鞋，为客户树立了可持续性的形象。
				品质把控：质量保证： 我们采用严格的质量控制流程，确保每一双鞋样都经过仔细检查和测试，以满足客户的高要求。定制能力：
				我们具有灵活的定制能力，能够根据客户的具体要求制作鞋样，包括设计、材料选择和生产工艺。可持续性： 我们关注可持续性，努力减少生产过程对环境的影响，采取了各种可持续性举措，包括可再生材料的使用和废弃物减少。
				交付准时性： 我们承诺按时交付客户的订单，确保项目按照预定时间表完成。
				附加信息：
				如果您有任何关于我们的需求或要求，或者希望了解更多关于我们的公司和合作流程的信息，请随时联系我们。我们期待着与您合作，共同打造出令人满意的鞋样。
				联系方式：
				公司地址：[公司地址]
				电话：[联系电话]
				电子邮件：[联系邮箱]
				网站：[公司网站]
				不要忘记在实际情况中自定义和个性化这份介绍，以突出你的公司的独特优势和价值。同时，确保提供可靠的联系信息以便潜在客户能够轻松与你取得联系。
			</view>
		</menu-wrapper>

		<!-- 页脚 -->
		<!-- <zw-footer></zw-footer> -->
	</view>
</template>

<script>
	import menuWrapper from '@/components/user/common/menu-wrapper.vue';
	import centerConfig from '@/common/config/user/center.config.js';

	import {
		mapState
	} from 'vuex';

	export default {
		components: {
			menuWrapper
		},
		data() {
			return {
				...centerConfig,
				accountInfo: {},
				counts: [],
				tabIndex: 1,
			}
		},
		computed: {
			...mapState(['loginUser']),
			currentTime() {
				const currentHour = new Date().getHours();
				const timeQuantums = ['凌晨', '上午', '下午', '晚上'];
				return timeQuantums[Math.floor(currentHour / 6)];
			}
		},
		onLoad() {
			this.$store.commit('tab', 6);
		},
		methods: {
			goUrl(url) {
				uni.navigateTo({
					url: url,
					fail(err) {
						console.log(err)
					}
				})
			},
			clickOption(index) {
				this.tabIndex = index;
			},
		}
	}
</script>

<style lang="scss">
	.align-center {
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.top-card {
		text-align: center;
		position: relative;
		height: 1000rpx;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		background: url('/static/image/home/bg.png') no-repeat;
		width: 100%;
		overflow: hidden;
		background-size: cover;

		.title {
			color: #FFFFFF;
			font-size: 47px;
			font-weight: 900;
			padding: 0px 110px;
		}

		.bg {
			border-radius: 15px;
			background: linear-gradient(107deg, rgba(254, 130, 219, 0.2) 5%, rgba(104, 228, 255, 0.2) 103%), rgba(241, 241, 241, 0.1);
			box-sizing: border-box;
			border: 1px solid;
			// border-image: linear-gradient(90deg, rgba(253, 132, 220, 0.5) 3%, rgba(127, 214, 250, 0.5) 100%) 1;
			backdrop-filter: blur(3px);
			height: 240rpx;
			width: 600rpx;
		}
	}

	.ld-title {
		margin-top: 60rpx;
		font-family: Source Han Sans;
		font-size: 48rpx;
		font-weight: 500;
		text-align: center;
		color: #555555;
		margin-left: 180rpx;
		padding-bottom: 10rpx;
	}

	.ld-title-active {
		font-weight: 900;
		text-align: center;
		color: #000000;
		border-bottom: 2px solid #0033FF;
	}
</style>